<template>
	<!-- 我的代办 -->
	<view style="padding-top: 150rpx;">
		<view v-for="item in list" :key="item.Id">
			<u-card :title="item.Name" :sub-title="item.CreatedUserRealName" thumb="">
				<view class="" slot="body">
					<div class="flex column">
						<span>审批事项: {{ item.ActivityName}}</span>
						<span>单号: {{ item.ReferenceNo}}</span>
						<span>创建时间: {{subTitle(item.CreatedTime)}}</span>
						<uni-tag :mark="true" :text="getTagColorText('text', item.StateText)" size="default"
							:type="getTagColorText('color', item.StateText)"
							style="width:130rpx;margin-top: 5rpx;text-align: center;border:none"
							:style="{backgroundColor:bgColor}" />
					</div>
				</view>
				<view class="" slot="foot">
					<div style="text-align: right;">
						<u-button size="mini" type="warning" style="height: 60rpx;margin-left: 25rpx;"
							@click="ApprovalHistoryClick(item)">审批记录</u-button>
						<u-button v-if="hasPermission('Ai_Workitem.Edit')" size="mini" type="primary"
							style="height: 60rpx;margin-left: 25rpx;" @click="DailyFormClick(item, 1)"
							:style="{backgroundColor:bgColor}">进入</u-button>
						<u-button
							v-if="hasPermission('Ai_Workitem.Delete') && item.CreatedUserId === item.ParticipantId && item.ActivityName=== '开始'"
							size="mini" type="error" style="height: 60rpx;margin-left: 25rpx;color:#fff"
							@click="DailyFormClick(item, 2)"><span>删除</span></u-button>
					</div>
					<!-- -->
					<!-- 	<div v-else class="submitButtonRecod">
						<u-button size="mini" @click="deli(item)" plain type="primary" style="height: 60rpx;"><span
								style="color:#000">
								查看</span></u-button>
					</div> -->
				</view>
			</u-card>
		</view>

		<div style="padding-bottom: 20px;">
			<LoadingMore :status="status" :contentText="contentText" :rows="list"></LoadingMore>
		</div>

	</view>
</template>

<script>
	import {
		mapState
	} from "vuex";
	import {
		// 获取我的代办列表
		Ai_WorkitemGetToDoDataList,
		// 我的待办列表删除
		Ai_WorkitemDeleteData,
		// 获取日常报销单主表详情
		Reimburse_Daily_MainGetTheData,
		// 获取差旅报销单主表详情
		Reimburse_Travel_Business_MainGetTheData,
		// 获取工资审批流详情
		Salary_ApprovalFormGetTheData,
		// 获取工资名册审批流详情
		SalaryRoster_ApprovalFormGetTheData,

	} from '@/api/interface.js'
	export default {
		props: {
			// 获取传递过来的公司id
			DetpId: {
				type: String,
			},
			parentObj: {
				type: Object,
				default: () => {}
			}
		},
		data() {
			return {
				// 加载状态
				status: "loading",
				contentText: {
					contentdown: '轻轻上拉',
					contentrefresh: '努力加载中...',
					contentnomore: '实在没有了'
				},
				list: [],
				sorter: {
					SortField: 'Id',
					SortType: 'desc'
				},
				loading: false,
				pagination: {
					current: 1,
					pageSize: 10,
				},
				Total: 0,
				queryParam: {
					// 暂时用单号搜索  后续根据需求 修改此处
					condition: "Name",
					keyword: ""
				},
			}
		},
		computed: {
			...mapState(["Permissions", "bgColor"]),
		},
		created() {
			// 获取我的代办列表
			this.getAi_WorkitemGetToDoDataList()
		},

		methods: {
			// 标签状态回调函数
			getTagColorText(key, state) {
				let color = ""
				let text = ""
				if (key === 'color') {
					if (state === '草稿') {
						color = ""
					} else if (state === '已取消') {
						color = "error"
					} else if (state === '运行中') {
						color = "primary"
					} else if (state === '已完成') {
						color = "success"
					}

					return color
				} else {
					text = state
					return text
				}
			},
			// 用于父组件调用上拉加载
			getReachBottom(current) {
				this.pagination.current = current
				// 上拉加载获取我的代办列表
				this.getAi_WorkitemGetToDoDataList()
			},
			// 按钮权限函数
			hasPermission(permission) {
				return this.Permissions.includes(permission)
			},
			// 列表时间格式化
			subTitle(value) {
				let time = ""
				if (value) {
					time = this.$moment(value).format("YYYY-MM-DD HH:mm")
				}
				return time
			},
			// 进入
			DailyFormClick(item, type) {
				var that = this
				// 点击的是删除
				if (type == 2) {
					this.$utils.showConfirm({
						content: '确定要删除吗',
						confirmText: "删除",
						confirmColor: "#D1100b"
					}).then(res => {
						if (res.confirm) {
							uni.showLoading({
								title: '删除中'
							})
							this.loading = true
							Ai_WorkitemDeleteData({
								Id: item.InstanceId,
								Type: item.TemplateName
							}).then(resJson => {
								if (resJson.Success) {
									that.$sucessToast('已删除')
									setTimeout(function() {
										that.loading = false
										uni.hideLoading()
									}, 2500)
									// 刷新我的发起列表
									that.openForm()
								} else {
									that.$errorToast(resJson.Msg);
									setTimeout(function() {
										that.loading = false
										uni.hideLoading()
									}, 2500)
								}
							})
						} else {
							this.loading = false;
						}
					})
					return
				}
				// 点击的是进入
				let disabled = item.CreatedUserId === item.ParticipantId && item.ActivityName === '开始' ? false : true

				// 日常报销单进入
				if (item.TemplateName === '日常报销单') {
					uni.navigateTo({
						url: "/pages/Approval/DailyForm?ApprovalFormId=" + item.ApprovalFormId + '&disabled=' +
							disabled + '&ActivityName=' + item.ActivityName + '&TemplateName=' + item.TemplateName
					})
					// 差旅报销单进入
				} else if (item.TemplateName === '差旅费报销单') {
					uni.navigateTo({
						url: "/pages/Approval/TravelForm?ApprovalFormId=" + item.ApprovalFormId + '&disabled=' +
							disabled + '&ActivityName=' + item.ActivityName + '&TemplateName=' + item.TemplateName
					})
				} else if (item.TemplateName === '工资审批流') {
					uni.navigateTo({
						url: "/pages/Approval/SalaryApprovalProcessForm?ApprovalFormId=" + item.ApprovalFormId +
							'&disabled=true&ActivityName=' + item.ActivityName + '&TemplateName=' + item
							.TemplateName + '&State=' + item.State + '&title=详情'
					})
				} else {
					console.log('工资名册审批流进入了', item)
					uni.navigateTo({
						url: "/pages/Approval/SalaryRosterApprovalForm?ApprovalFormId=" + item.ApprovalFormId +
							'&disabled=true&ActivityName=' + item.ActivityName + '&TemplateName=' + item
							.TemplateName + '&State=' + item.State + '&title=详情'
					})
				}


			},
			// 审批历史跳转
			ApprovalHistoryClick(item) {
				if (item.TemplateName === '日常报销单') {
					// 日常报销单详情
					this.getReimburse_Daily_MainGetTheData(item)
				} else if (item.TemplateName === '差旅费报销单') {
					// 差旅报销单详情
					this.getReimburse_Travel_Business_MainGetTheData(item)
				} else if (item.TemplateName === '工资审批流') {
					// 获取工资审批流详情
					this.getSalary_ApprovalFormGetTheData(item)
				} else {
					// 获取工资名册审批流详情
					this.getSalaryRoster_ApprovalFormGetTheData(item)
				}

			},
			// 获取工资审批流详情
			getSalary_ApprovalFormGetTheData(item) {
				uni.showLoading({
					title: '加载中'
				})
				Salary_ApprovalFormGetTheData({
					id: item.ApprovalFormId
				}).then(resJson => {
					if (resJson.Success) {
						uni.hideLoading()
						if (resJson.Data.ai_Workitems !== null) {
							resJson.Data.ai_Workitems.forEach(item => {
								// 日期格式化
								item.StartTime = this.$moment(item.StartTime).format(
									"YYYY-MM-DD hh:mm:ss")
							})
						}
						let ai_Workitems = JSON.stringify(resJson.Data.ai_Workitems)
						uni.navigateTo({
							url: "/pages/Approval/ApprovalHistory?ai_Workitems=" + ai_Workitems
						})
					}
				})
			},
			// 获取工资名册审批流详情
			getSalaryRoster_ApprovalFormGetTheData(item) {
				uni.showLoading({
					title: '加载中'
				})
				SalaryRoster_ApprovalFormGetTheData({
					id: item.ApprovalFormId
				}).then(resJson => {
					if (resJson.Success) {
						uni.hideLoading()
						if (resJson.Data.ai_Workitems !== null) {
							resJson.Data.ai_Workitems.forEach(item => {
								// 日期格式化
								item.StartTime = this.$moment(item.StartTime).format(
									"YYYY-MM-DD hh:mm:ss")
							})
						}
						let ai_Workitems = JSON.stringify(resJson.Data.ai_Workitems)
						uni.navigateTo({
							url: "/pages/Approval/ApprovalHistory?ai_Workitems=" + ai_Workitems
						})
					}
				})
			},
			// 日常报销单详情
			getReimburse_Daily_MainGetTheData(item) {
				uni.showLoading({
					title: '加载中'
				})
				Reimburse_Daily_MainGetTheData({
					id: item.ApprovalFormId
				}).then(resJson => {
					if (resJson.Success) {
						uni.hideLoading()
						if (resJson.Data.ai_Workitems !== null) {
							resJson.Data.ai_Workitems.forEach(item => {
								// 日期格式化
								item.StartTime = this.$moment(item.StartTime).format(
									"YYYY-MM-DD hh:mm:ss")
							})
						}
						let ai_Workitems = JSON.stringify(resJson.Data.ai_Workitems)
						uni.navigateTo({
							url: "/pages/Approval/ApprovalHistory?ai_Workitems=" + ai_Workitems
						})
					} else {
						uni.hideLoading()
						this.$errorToast(resJson.Msg)
					}
				})
			},
			// 差旅费报销单详情
			getReimburse_Travel_Business_MainGetTheData(item) {
				uni.showLoading({
					title: '加载中'
				})
				Reimburse_Travel_Business_MainGetTheData({
					id: item.ApprovalFormId
				}).then(resJson => {
					if (resJson.Success) {
						uni.hideLoading()
						if (resJson.Data.ai_Workitems !== null) {
							resJson.Data.ai_Workitems.forEach(item => {
								// 日期格式化
								item.StartTime = this.$moment(item.StartTime).format(
									"YYYY-MM-DD hh:mm:ss")
							})
						}

						let ai_Workitems = JSON.stringify(resJson.Data.ai_Workitems)
						uni.navigateTo({
							url: "/pages/Approval/ApprovalHistory?ai_Workitems=" + ai_Workitems
						})
					} else {
						uni.hideLoading()
						this.$errorToast(resJson.Msg)
					}
				})
			},
			// 获取我的代办列表
			getAi_WorkitemGetToDoDataList() {
				this.status = "loading"
				uni.showLoading({
					title: '加载中'
				})
				Ai_WorkitemGetToDoDataList({
					DeptId: this.DetpId,
					PageIndex: this.pagination.current,
					PageRows: this.pagination.pageSize,
					Search: this.queryParam,
					...this.sorter
				}).then(resJson => {
					if (resJson.Success) {
						uni.hideLoading()
						// 赋值总条数
						this.Total = resJson.Total;
						if (resJson.Data == null) {
							this.status = 'noMore'; // 没有更多数据
							return
						}
						if (this.pagination.current == 1) {
							this.list = resJson.Data;
						} else {
							this.list = this.list.concat(resJson.Data);
						}
						// this.list.forEach(item => {
						// 	item.SNameList = item.SharerNameList ?
						// 		item.SharerNameList.join("|") :
						// 		"";
						// });
						if (this.list.length >= resJson.Total) {
							this.status = 'noMore'; // 没有更多数据
						} else {
							this.status = 'loading'; // 没有更多数据
						}
					} else {
						this.status = 'noMore'; // 没有更多数据
					}
				})
			},

			openForm() {
				this.pagination.current = 1
				this.list = []
				console.log('是否清空数组了', this.list)
				this.$forceUpdate()
				// 获取我的代办列表
				this.getAi_WorkitemGetToDoDataList()
			}
		}
	}
</script>

<style lang="less" scoped>
</style>